<%--
  Created by IntelliJ IDEA.
  User: WheelChen
  Date: 2017/7/3
  Time: 14:24
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" %>
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>创建学院管理员</title>
    <link rel="stylesheet" type="text/css" href="/static/common/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/static/css/global.css">
</head>
<body>
<div class="admin-main">
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>创建学院管理员</legend>
    </fieldset>
    <div id="college">
        <fieldset class="layui-elem-field">
            <legend>选择学院</legend>
            <div class="layui-field-box">
                <form class="layui-form">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">大学：</label>
                            <div class="layui-input-inline">
                                <select name="universities" lay-verify="required" id="showUniversity"
                                        lay-filter="university"
                                        v-model="school.universityid" lay-search>
                                    <option value="">请选择大学</option>
                                </select>
                            </div>
                        </div>

                        <div class="layui-inline">
                            <label class="layui-form-label">学院：</label>
                            <div class="layui-input-inline">
                                <select name="schools" lay-verify="required" id="showSchool" lay-filter="school"
                                        v-model="school.universityid" lay-search>
                                    <option value="">请选择学院</option>
                                </select>
                            </div>
                        </div>

                        <%--<div class="layui-inline">--%>
                        <%--<label class="layui-form-label">部门：</label>--%>
                        <%--<div class="layui-input-inline">--%>
                        <%--<select name="departments" lay-verify="required" id="showDepartment"--%>
                        <%--lay-filter="department"--%>
                        <%--v-model="school.universityid" lay-search>--%>
                        <%--<option value="">请选择部门</option>--%>
                        <%--</select>--%>
                        <%--</div>--%>
                        <%--</div>--%>
                    </div>
                    <div class="layui-form-item" style="width: 300px">
                        <label class="layui-form-label">账号</label>
                        <div class="layui-input-block">
                            <input type="text" name="title" required lay-verify="required" placeholder="请输入账号"
                                   class="layui-input" v-model="user.username">
                        </div>
                    </div>
                    <div class="layui-form-item" style="width: 300px">
                        <label class="layui-form-label">密码</label>
                        <div class="layui-input-block">
                            <input type="text" name="title" required lay-verify="required" placeholder="请输入密码"
                                   class="layui-input" v-model="user.password">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn" lay-submit lay-filter="create">创建</button>
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>
    </div>
</div>

<script src="../../static/common/layui/layui.js"></script>
<script src="../../static/common/vue.min.js"></script>
<script src="../../static/common/axios.min.js"></script>
<script>
    "use strict";
    layui.use(['form', 'layer'], function () {
        var form = layui.form(),
            $ = layui.jquery,
            layer = layui.layer;
        var vm = new Vue({
            el: '#college',
            data: {
                user: {
                    usertype: 3
                },
                schoolManagerInfo: {},
                school: {}
            }
        });
        //联动对象
        var linkage = {};
        //渲染下拉框
        linkage.formRender = function (obj, tip) {
            $(obj).empty();
            $(obj).append('<option value="">' + tip + '</option>');
            form.render('select');
        };
        //读取数据库信息并写回到select框中
        linkage.read = function (obj, url, init) {
            axios.get(url)
                .then(function (res) {
                    var array = res.data.data;
                    var html = '';
                    for (var i in array) {
                        html += '<option value=' + array[i].id + '>' + array[i].name + '</option>';
                    }
                    $(obj).append(html);
                    form.render('select');
                    if (init) $(obj).next().find('[lay-value="' + init + '"]').click();
                })
                .catch(function (res) {
                    console.log(res);
                });
        };
        var university = 'form select[name=universities]',
            school = 'form select[name=schools]',
            department = 'form select[name=departments]';

        //读取大学
        if ($(university).length) {
            linkage.formRender(university, "选择大学");
            linkage.read(university, '/university/findAll');
            //读取学院
            if ($(school).length) {
                linkage.formRender(school, "选择学院");
                form.on('select(university)', function (data) {
                    vm.schoolManagerInfo.universityid = data.value;
                    linkage.formRender(school, "选择学院");
                    linkage.read(school, '/school/findBath/' + data.value);
                });


            }
        }

        //设置学院管理员系id
        form.on('select(school)', function (data) {
            vm.schoolManagerInfo.schoolid = data.value;
        });

        //监听学院管理员创建
        form.on('submit(create)', function () {
            axios.post("/schoolMangerInfo/addAccount", {
                user: vm.user,
                schoolManagerInfo: vm.schoolManagerInfo
            })
                .then(function (response) {
                    console.log(response.data);
                    if (response.data.success)
                        layer.msg("创建成功");
                    else
                        layer.msg(response.data.message);
                })
                .catch(function (response) {
                    console.log(response);
                });
            return false;
        })

    })
</script>
</body>
</html>
